<!--
  ~ This program is part of the OpenLMIS logistics management information system platform software.
  ~ Copyright © 2013 VillageReach
  ~
  ~  This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~
  ~  This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~  You should have received a copy of the GNU Affero General Public License along with this program.  If not, see http://www.gnu.org/licenses.  For additional information contact info@OpenLMIS.org.
  -->

<ng-include
  src="'/public/pages/logistics/distribution/partials/record-facility-data.html'"></ng-include>
<div class="clearfix facility-container">
  <ng-include
    src="'/public/pages/logistics/distribution/partials/record-facility-menu.html'"></ng-include>

  <div class="facility-info" ng-init="facilityData = distribution.facilityDistributions[selectedFacilityId]">
    <div class="refrigerator-container" disable-form="{{facilityData.isDisabled('epi-inventory')}}">
      <h3>
        <span id="epiInventoryPageLabel" openlmis-message="label.epi.inventory.header"></span>
        <input id="epiInventoryApplyNRAll" type="button" ng-click="applyNRAll()" class="pull-right btn"
               openlmis-message="button.apply.nr.all"/>
      </h3>

      <div class="clearfix"></div>
      <div class="alert alert-info" id="noLineItems" ng-hide="facilityData.epiInventory.lineItems.length">
        <span openlmis-message="message.no.product.groups"></span>
      </div>

            <div id="epiInventoryContainer" class="parent facility-distribution-form-table" tab-scroll bottom-offset="180"
                 ng-show="facilityData.epiInventory.lineItems.length">
                <form auto-save="distribution" object-store="distributions">
                    <table id="epiInventoryTable" class="table table-bordered" fixed-table-header>
                        <thead>
                        <tr>
                            <th id="vialsUnitsLabel" class="col-vials" openlmis-message="label.vials.unit"></th>
                            <th id="idealQuantityLabel" class="col-ideal-quantity"
                                openlmis-message="label.ideal.quantity"></th>
                            <th id="existingQuantityLabel" class="col-existing-quantity"
                                openlmis-message="label.existing.quantity"></th>
                            <th id="deliveredQuantityLabel" class="col-delivered-quantity"
                                openlmis-message="label.delivered.quantity"></th>
                            <th id="spoiledQuantityLabel" class="col-spoiled-quantity"
                                openlmis-message="label.spoiled.quantity"></th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr ng-repeat="lineItem in facilityData.epiInventory.lineItems">
                            <td id="productName{{ $index }}" class="col-vials">
                                <span ng-bind="lineItem.productName"></span>
                            </td>
                            <td id="idealQuantityByPackSize{{ $index }}" class="col-ideal-quantity">
                <span ng-show="(lineItem.idealQuantityByPackSize === 0) || (lineItem.idealQuantityByPackSize)"
                      ng-bind="lineItem.idealQuantityByPackSize"></span>
                                <span ng-hide="(lineItem.idealQuantityByPackSize === 0) || (lineItem.idealQuantityByPackSize)">--</span>
              </td>
              <td class="col-existing-quantity">
                <div>
                  <span class="position-relative">
                    <input id="existingQuantity{{ $index }}" type="number" ng-model="lineItem.existingQuantity.value"
                           name="existingQuantityNR{{$index}}" ng-trim=false
                           numeric-validator="positiveInteger,7" min="0" max="9999999" step="1"
                           error-holder="existingQuantityError{{$index}}"
                           ng-class="{'required-error': !facilityData.isDisabled('epi-inventory') && !(lineItem.existingQuantity.value.hasValue() || lineItem.existingQuantity.notRecorded)}"/>
                    <span id="existingQuantityError{{$index}}"
                          class="rnr-form-error"
                          openlmis-message="error.number.only"
                          style="display: none"></span>
                  </span>
                </div>
                <input id="existingQuantityNR{{$index}}" type="checkbox"
                       ng-model="lineItem.existingQuantity.notRecorded"
                       not-recorded/>
                <label class="checkbox-label" for="existingQuantityNR{{$index}}"
                       openlmis-message="label.not.recorded"></label>
              </td>
              <td class="col-delivered-quantity">
                <div>
                  <span class="position-relative">
                    <input id="deliveredQuantity{{ $index }}" type="number" ng-model="lineItem.deliveredQuantity"
                           name="deliveredQuantityNR{{ $index }}" ng-trim=false
                           numeric-validator="positiveInteger,7" min="0" max="9999999" step="1"
                           error-holder="deliveredQuantityError{{$index}}"
                           ng-class="{'required-error': !facilityData.isDisabled('epi-inventory') && !lineItem.deliveredQuantity.hasValue()}"/>
                    <span id="deliveredQuantityError{{$index}}"
                          class="rnr-form-error"
                          openlmis-message="error.number.only"
                          style="display: none"></span>
                  </span>
                </div>
              </td>
              <td class="col-spoiled-quantity">
                <div>
                  <span class="position-relative">
                    <input id="spoiledQuantity{{ $index }}" type="number"
                           ng-model="lineItem.spoiledQuantity.value"
                           name="spoiledQuantityNR{{ $index }}" ng-trim=false
                           numeric-validator="positiveInteger,7" min="0" max="9999999" step="1"
                           error-holder="spoiledQuantityError{{$index}}"
                           ng-class="{'required-error': !facilityData.isDisabled('epi-inventory') && !(lineItem.spoiledQuantity.value.hasValue() || lineItem.spoiledQuantity.notRecorded)}"/>
                    <span id="spoiledQuantityError{{$index}}" class="rnr-form-error"
                          openlmis-message="error.number.only"
                          style="display: none"></span>
                  </span>
                </div>
                <input id="spoiledQuantityNR{{ $index }}" type="checkbox"
                       ng-model="lineItem.spoiledQuantity.notRecorded"
                       not-recorded/>
                <label class="checkbox-label" for="spoiledQuantityNR{{ $index }}"
                       openlmis-message="label.not.recorded"></label>
              </td>
            </tr>
            </tbody>
          </table>
        </form>
      </div>
    </div>
  </div>
</div>
